<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/layuimini/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="/layuimini/css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">

        <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">用户姓名</label>
                            <div class="layui-input-inline">
                                <input type="text" name="userName" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">积分来源</label>
                            <div class="layui-input-block">
                                <select lay-verify="required" name="sourceCode">
                                    <option value="1" selected>每次下单</option>
                                    <option value="2">历史订单够3次</option>
                                    <option value="3">每次下单数量多于3次</option>
                                </select>
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">获取时间</label>
                            <div class="layui-input-inline">
                                <input type="Date"  name="createTime" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn layui-btn-primary"  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                        <div class="layui-inline">
                            <button type="reset" class="layui-btn layui-btn-primary" ><i class="layui-icon layui-icon-refresh"></i> 重置</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>

        <script type="text/html" id="toolbarDemo">
            <div class="layui-btn-container">

                <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="deleteAll"> 删除 </button>
            </div>
        </script>

        <table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>

        <script type="text/html" id="currentTableBar">

            <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
        </script>

    </div>
</div>
<script src="/layuimini/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<!--<script th:src="@{/layuimini/js/layui.js}"></script>-->
<script type="text/javascript">
    function createTime(v){
        var date = new Date(v);
        var y = date.getFullYear();
        var m = date.getMonth()+1;
        m = m<10?'0'+m:m;
        var d = date.getDate();
        d = d<10?("0"+d):d;
        var h = date.getHours();
        h = h<10?("0"+h):h;
        var M = date.getMinutes();
        M = M<10?("0"+M):M;
        var str = y+"-"+m+"-"+d+" "+h+":"+M;
        return str;
    }
</script>
<script >
    var userId = parent.userId;
            layui.use(['form', 'table'], function () {
                var $ = layui.jquery,
                    form = layui.form,
                    table = layui.table;

                table.render({
                    elem: '#currentTableId',
                    url: 'http://localhost:8080/scoreDetail/findScoreDetailByUserId/' + userId,
                    headers: {'X-Authorization-With':window.sessionStorage.getItem('jwt')},
                    toolbar: '#toolbarDemo',
                    defaultToolbar: ['filter', 'exports', 'print', {
                        title: '提示',
                        layEvent: 'LAYTABLE_TIPS',
                        icon: 'layui-icon-tips'
                    }],
                    cols: [
                        [
                            {type: "checkbox", width: 50},
                            {field: 'id', width: 100, title: 'ID', sort: true},
                            {field: 'totalScoreId', width: 100, title: '积分总表ID'},
                            {field: 'userId', width: 100, title: '用户ID'},
                            {field: 'userName', width: 100, title: '用户名', sort: true , align:'center'},
                            {field: 'sourceDesc', width: 150, title: '积分来源', sort: true , align:'center'},
                            {field: 'score', width: 200, title: '获取的积分', sort: true , align:'center'},
                            {field: 'createTime', width: 150, title: '创建时间', sort: true,
                                templet:function (d) {
                                    return createTime(d.createTime)
                                }
                            },
                            {field: 'modifyTime', width: 150, title: '修改时间', sort: true,
                                templet:function (d) {
                                    return createTime(d.modifyTime)
                                }
                            },
                            {title: '操作', minWidth: 50, toolbar: '#currentTableBar', align: "center"}
                        ]
                    ],
                    limits: [10, 15, 20, 25, 50, 100],
                    limit: 15,
                    page: true,
                    parseData: function (res) { //将原始数据解析成 table 组件所规定的数据
                        return {
                            "code": res.code, //解析接口状态
                            "msg": res.msg, //解析提示文本
                            "count": res.data.total, //解析数据长度
                            "data": res.data.rows //解析数据列表
                        };
                    },
                    skin: 'line'
                });

                // 监听搜索操作
                form.on('submit(data-search-btn)', function (data) {
                   /* var data = JSON.stringify(data.field);*/
                   /*  =  $("#sourceDescSelect option:selected").val();;*/
                    table.reload('currentTableId', {
                        url: '/scoreDetail/QueryScoreDetailByCondition',
                        method:'post',
                        page: {
                            curr: 1
                        }
                        ,where: data.field
                        /*,done: function () {
                            this.where={};
                        }*/
                    }, 'data');

                    return false;
                });

                /**
                 * toolbar监听事件
                 */
                table.on('toolbar(currentTableFilter)', function (obj) {
                    if (obj.event === 'add') {  // 监听添加操作
                        var index = layer.open({
                            title: '添加用户',
                            type: 2,
                            shade: 0.2,
                            maxmin:true,
                            shadeClose: true,
                            area: ['100%', '100%'],
                            content: '../page/table/add.html',
                        });
                        $(window).on("resize", function () {
                            layer.full(index);
                        });
                    } else if (obj.event === 'delete') {  // 监听删除操作
                        var checkStatus = table.checkStatus('currentTableId')
                            , data = checkStatus.data;
                        layer.alert(JSON.stringify(data));
                    } else if (obj.event === 'deleteAll') {  // 监听删除操作
                        var checkStatus = table.checkStatus('currentTableId')
                            , data = checkStatus.data;
                        var jsonDataList = JSON.stringify(data);
                        var len = jsonDataList.length;
                        if(Array.prototype.isPrototypeOf(jsonDataList) || (len === 0)) {
                            layer.alert("请勾选复选框")
                            return;
                        }
                        if(confirm("确定要删除吗？")){
                            $.ajax({
                                type:"post",
                                url:"/scoreDetail/batchDelete",//controller中的请求路径
                                data:jsonDataList,//controller返回的数据为data，{'productList':productList.toString()}为json对象，例如data:{result:1}
                                dataType:'json',
                                contentType: "application/json;charset=UTF-8",
                                success:function (result) {
                                    <!--data.result获取result的值-->
                                    if(result.code == 200 ){
                                        layer.msg("删除成功");
                                        setTimeout(function(){
                                            window.location.reload(true)
                                        },2000);
                                    }

                                },
                                error:function () {
                                    layer.msg("删除失败")
                                    setTimeout(function(){
                                        document.execCommand('Refresh')
                                    },2000);
                                },
                                finally:function () {

                                }
                            })
                        }
                    }
                });

                //监听表格复选框选择
                table.on('checkbox(currentTableFilter)', function (obj) {
                    console.log(obj)
                    console.log(obj.data)
                    if (obj.data.id != null  && obj.checked) {
                        layer.msg("已加入删除列表")
                    } else if (obj.data.id != null  && !obj.checked) {
                        layer.msg("已移出删除列表")
                    }
                });

                table.on('tool(currentTableFilter)', function (obj) {
                    var data = obj.data;
                    if (obj.event === 'detail') {
                        var jsonData = JSON.stringify(data);
                        alert(jsonData)
                        $.ajax({
                            type: "POST",
                            url: "/scoreDetail/findScoreDetailByUserId",
                            data: jsonData,
                            dataType: "json",
                            contentType: "application/json;charset=utf-8",
                            success: function(result) {
                                if(result.code == 200) {
                                    var dataList = result.data;
                                    var len = dataList.length;
                                    var str = "id &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; " +
                                        "totalScoreId &nbsp;&nbsp;&nbsp;&nbsp;  " +
                                        "积分 &nbsp;&nbsp;&nbsp;&nbsp;" +
                                        "积分来源 &nbsp;&nbsp;&nbsp;&nbsp;" +
                                        "创建时间 &nbsp;&nbsp;&nbsp;&nbsp; 更改时间" + "<br/>";
                                    for (let i = 0 ; i < len ; i ++) {
                                        str = str
                                            + "&nbsp;&nbsp;" + dataList[i].id
                                            + "&nbsp;&nbsp;" + dataList[i].totalScoreId
                                            + "&nbsp;&nbsp;" + dataList[i].score + "  " + dataList[i].source
                                            + "&nbsp;&nbsp;" + createTime(dataList[i].modifyTime)
                                            + "&nbsp;&nbsp;" + createTime(dataList[i].createTime) + "<br/>"
                                    }
                                    layer.alert(str , {
                                        title: '积分详情',
                                        area: ['600px', '400px']
                                    });
                                    //执行搜索重载
                                    table.reload('currentTableId', {
                                        page: {
                                            curr: 1
                                        }
                                        , where: {
                                            searchParams: null
                                        }
                                    }, 'data');
                                } else {
                                    layer.msg(result.msg, {
                                        icon: 5
                                    });
                                }
                            }
                        });
                        /*var index = layer.open({
                            title: '编辑用户',
                            type: 2,
                            shade: 0.2,
                            maxmin:true,
                            shadeClose: true,
                            area: ['100%', '100%'],
                            content: '../page/table/edit.html',
                        });
                        $(window).on("resize", function () {
                            layer.full(index);
                        });*/
                        return false;
                    } else if (obj.event === 'delete') {
                        layer.confirm('真的删除行么', function (index) {
                            obj.del();
                            layer.close(index);
                            $.ajax({
                                type: "DELETE",
                                url: "/scoreDetail/deleteById/"+ data.id ,
                                data: JSON.stringify({"id": data.id}),
                                dataType: "json",
                                contentType: "application/json;charset=utf-8",
                                success: function(result) {
                                    if(result.code == 200) {
                                        layer.msg(result.msg,{icon: 1});
                                        setTimeout(function(){
                                            window.location.reload(true)
                                        },1000);
                                    } else {
                                        layer.msg(result.msg, {
                                            icon: 5
                                        });
                                    }
                                }
                            });
                        });
                    }
                });

            });



</script>

</body>
</html>